<%@page contentType="text/html; charset=utf-8"%>
<%@include file="/WEB-INF/views/common/taglibs.jspf" %>


<link rel="stylesheet" href="${ctx}/static/plugins/zTree/css/zTreeStyle/zTreeStyle.css" />
<link rel="stylesheet" href="${ctx}/static/plugins/jqwidgets/jqwidgets/styles/jqx.base.css" />
<link rel="stylesheet" href="${ctx}/static/plugins/jqwidgets/jqwidgets/styles/jqx.darkblue.css" />
 
<title>系统资源管理</title>

<div class="page-header">
	<h1>
		资源列表 
	</h1>
</div>
<div class="row">
	<div class="col-xs-12">
		<div class="row">
			<div class="col-xs-9">
				<form id="search_form" style="float:left;">
					<span class="input-icon">
						<input id="quickSearch" type="text" class="input-sm" name="quickSearch" placeholder="快速搜索 ...">
						<i class="ace-icon fa fa-search blue"></i>
					</span>
					<span class="input-icon">
						<input type="text" class="date-picker input-sm input-medium" name="startTime">
						<i class="ace-icon fa fa-calendar blue"></i>
					</span>
					<span class="input-icon">
						<input type="text" class="date-picker input-sm input-medium" name="endTime">
						<i class="ace-icon fa fa-calendar blue"></i>
					</span>
					<span class="input-icon" style="float:left;">
						<select name="status">
							<option value="" selected="selected">账户状态</option>
							<option value="normal">正常</option>
							<option value="blocked">禁用</option>
						</select>
					</span>
					
				</form>
				<button class="btn btn-purple btn-xs height-30" onclick="oSearch();">
					<i class="ace-icon fa fa-search bigger-120"></i>
					搜索
				</button>
				<button class="btn btn-pink btn-xs height-30" onclick="resetSearch();">
					<i class="ace-icon fa fa-undo bigger-120"></i>
					重置
				</button>
			</div>
			<div class="col-xs-3">
				<div class="pull-right">
					<button class="btn btn-success btn-xs height-30" onclick="formDialog();"><i class="ace-icon fa fa-plus bigger-120"></i> 新增</button>
					<button class="btn btn-info btn-xs height-30" onclick="edit();"><i class="ace-icon fa fa-pencil bigger-120"></i> 编辑</button>
					<button class="btn btn-danger btn-xs height-30" onclick="batchDel();"><i class="ace-icon fa fa-trash bigger-120"></i> 删除</button>
					<button class="btn btn-success pink btn-xs height-30" onclick="oTable.ajax.reload();"><i class="ace-icon fa fa-refresh fa-spin bigger-120"></i> 刷新</button>
				</div>
			</div>
		</div>
		<div class="space-2"></div>
		
		<div class="row">
			<div class="col-xs-4">
				<ul id="test_tree1" class="ztree"></ul>
			</div>
			<div class="col-xs-8"></div>
		</div>
		<div class="space-2"></div>
		
	
		<div class="row">
			<div class="col-xs-12">
			
				<div id="treeGrid"></div>
				
			</div>
		</div>
		
		
		<!-- PAGE CONTENT ENDS -->
	</div><!-- /.col -->
</div><!-- /.row -->

<script type="text/javascript">
var scripts = [null, 
               "${ctx}/static/plugins/zTree/js/jquery.ztree.core-3.5.js", 
               "${ctx}/static/plugins/zTree/js/jquery.ztree.excheck-3.5.js", 
               "${ctx}/static/plugins/jqwidgets/jqwidgets/jqxcore.js", 
               "${ctx}/static/plugins/jqwidgets/jqwidgets/jqxbuttons.js", 
               "${ctx}/static/plugins/jqwidgets/jqwidgets/jqxdata.js", 
               "${ctx}/static/plugins/jqwidgets/jqwidgets/jqxscrollbar.js", 
               "${ctx}/static/plugins/jqwidgets/jqwidgets/jqxdatatable.js", 
               "${ctx}/static/plugins/jqwidgets/jqwidgets/jqxtreegrid.js", 
               null];
$('.page-content-area').ace_ajax('loadScripts', scripts, function() {
	jQuery(function($) {
		
		
		var t1 = $("#test_tree1");
		$.get("${ctx}/admin/sys/resource/tree", function(result) {
			$.fn.zTree.init(t1, {
				check: {
					enable: true,
					chkStyle: "radio",
					radioType: "all"
				},
				callback: {
					onClick: onClick,
					onCheck: onCheck
				}
			}, result);
		},"JSON") ;
		
		
		function onClick(e, treeId, treeNode) {
			var zTree = $.fn.zTree.getZTreeObj("test_tree1");
			zTree.checkNode(treeNode, !treeNode.checked, null, true);
			return false;
		}

		function onCheck(e, treeId, treeNode) {
			var zTree = $.fn.zTree.getZTreeObj("test_tree1"),
			nodes = zTree.getCheckedNodes(true),
			v = "";
			for (var i=0, l=nodes.length; i<l; i++) {
				v += nodes[i].id + ",";
			}
			if (v.length > 0 ) v = v.substring(0, v.length-1);
			alert(v) ;
		}
		
		
		
		
		
		
		
		
		
		
		var source = {
				dataType: "json", url: "${ctx}/admin/sys/resource/allList",
				id: "id", hierarchy: {keyDataField: {name: "id"}, parentDataField: {name: "pid"}},
				dataFields: [
					{name: "id", type: "number"},
					{name: "name", type: "string"},
					{name: "url", type: "string"},
					{name: "pid", type: "number"}, 
				]
		};
		var dataAdapter = new $.jqx.dataAdapter(source);
		$("#treeGrid").jqxTreeGrid({
			source: dataAdapter,
			width: "full",
			columns: [
				{text: "编号", dataField: "id", width: 100},
				{text: "名称", dataField: "name", width: 200},
				{text: "URL", dataField: "url", width: "auto"}
			]
		});
		
		
		
	});
});

function formDialog(id){
	var url = "${ctx}/admin/sys/resource/form" ;
	if(undefined != id && id != "") {
		url = "${ctx}/admin/sys/resource/form?id="+id ;
	}
	var loadIndex = layer.load(0, {shade : [0.3]});
	$.ajax({
		url: url, cache:false
	}).error(function(event, XMLHttpRequest, ajaxOptions, thrownError){
		if(event.status == 404) {layer.close(loadIndex); $.dialog.tips("404请求地址不正确！", 2, "fa-times red"); } 
		else {layer.close(loadIndex); $.dialog.tips("请求发生错误，错误代码："+event.status, 2, "fa-times red"); }
	}).done(function(result){
		dialogIndex = layer.open({
		    type: 1, //page层
		    area: ['900px', '500px'],
		    title: '添加',
		    skin: 'seaning', //墨绿风格
		    shade: 0.6, //遮罩透明度
		    shift: 2, //0-6的动画形式，-1不开启 
		    scrollbar: false, //禁用浏览器滚动条
		    content: result,
		    success: function(layero, index){ layer.close(loadIndex); },
		    btn: ['提交', '取消'],
		    yes: function(index, layero){
		    	if(undefined == id) {
		    		ajax("${ctx}/admin/sys/user/add") ;
		    	} else {
		    		ajax("${ctx}/admin/sys/user/update") ;
		    	}
		    },cancel: function(index){}
		}); 
	});
};

</script>


